//修改模板
import {Button, Form, Input, Row, Col, Modal, Select, Table, Pagination, Radio, Layout, Tree, Icon} from 'antd';
import React, {Component} from 'react';
import {ButtonSubmit} from "./AddComponent";
import MapComponent from './MapComponent';
import app from '../AppMethod';
import {line, car, customer} from "../value";
import {requestUrl, sku, menu, merchant, helpCenter, roleAssignment, logistics, outbound,printer} from '../value';
import moment from 'moment';
import {config} from "../config";


const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;
const Content = Layout.Content;
const TreeNode = Tree.TreeNode;
const confirm = Modal.confirm;

//修改地址信息
class EditAddress extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            editConfirmLoading: false,
            data: {
                address: '广东省佛山市三水区xxxxxx',
                latitude: '23.3333334',//纬度
                longitude: '150.333335'//经度
            },
            position: {lng: 116.403981, lat: 39.91582},
            map: {},
        };
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                 <span style={{color: '#1890ff', cursor: 'pointer'}}
                       onClick={() => this.setModal2Visible(true)}>修改地址信息</span>
                <Modal
                    maskClosable={true}
                    confirmLoading={this.state.editConfirmLoading}
                    title={this.props.title}
                    wrapClassName="vertical-center-modal"
                    width={'1000px'}
                    visible={this.state.editVisible}
                    onCancel={() => this.setModal2Visible(false)}
                    footer={[
                        <Button key="back" type="default" onClick={() => this.setModal2Visible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.handleSubmit()}>确定</Button>
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                <FormItem>
                                    {
                                        getFieldDecorator('customer_address')(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                                <Row>
                                    <MapComponent getPoint={(values) => this.getPoint(values)}/>
                                </Row>
                                <Row style={{marginTop: '20px'}}>
                                    <Col span={24}>地址：{this.state.data.address}</Col>
                                </Row>
                                <Row style={{marginTop: '15px'}}>
                                    <Col span={7}>经度：{this.state.data.longitude}</Col>
                                    <Col span={7}>纬度：{this.state.data.latitude}</Col>
                                </Row>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    componentDidMount() {
        //const ak='oRWGDbqAGRP8rAyvBBcGHqlVM8ni8mBC';
    }

    setModal2Visible(visible) {
        this.setState({
            editVisible: visible
        })
    };

    handleSubmit() {

    };

    getEvents() {
        return {
            click: ({type, target, point, pixel, overlay}) => {
                let data = {
                    address: target.Yg,
                    latitude: point.lat,
                    longitude: point.lng
                };
                let position = {
                    lng: point.lng,
                    lat: point.lat,
                };
                this.setState({data, position});

            },
        }
    };

    getPoint(point) {
        let data = {
            address: point.Yg,
            latitude: point.lat,
            longitude: point.lng
        };
        let position = {
            lng: point.lng,
            lat: point.lat,
        };
        this.setState({data, position});
    }
};

const EditAddresss = Form.create()(EditAddress);

class EditLine extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            editConfirmLoading: false,
            data: {},
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}}
                      onClick={(e) => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    confirmLoading={this.state.editConfirmLoading}
                    title={this.props.title}
                    wrapClassName="vertical-center-modal"
                    width="600px"
                    visible={this.state.editVisible}
                    onCancel={() => {
                        this.setModalVisible(false)
                    }}
                    footer={[
                        <Button key="back" type='default' onClick={() => {
                            this.setModalVisible(false)
                        }}>取消</Button>,
                        <Button key="submit" type="primary" onClick={() => {
                            this.clickOk()
                        }}>确定</Button>
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                <FormItem label="路线名称" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('route_name', {
                                            rules: [{required: true, message: '请输入路线名称'}]
                                        })(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = {
                route_name: this.props.data.route_name
            };
            this.props.form.setFieldsValue(data);
        }
        this.setState({
            editVisible: visible
        });
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    route_id: this.props.data.route_id,
                    route_name: values.route_name
                }
                app.post(line.UPDATE_LINE, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('修改成功', 'success', 3);
                        this.setModalVisible(false);
                        this.props.click();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        });
    }
};
const EditLines = Form.create()(EditLine);

//选择员工
class EditRole extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            roleData: [],
            chooseData: [],
            confirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        const _this = this;
        return (
            <span>
                <Button type='primary' onClick={() => this.setModalVisible(true)}
                        style={{marginLeft: '10px'}}>编辑</Button>
                <Row>
                    <Modal
                        maskClosable={true}
                        visible={this.state.editVisible}
                        editConfirmLoading={this.state.editConfirmLoading}
                        confirmLoading={this.state.confirmLoading}
                        title="选择员工"
                        wrapClassName="vertical-center-modal"
                        width="600px"
                        onCancel={() => this.setModalVisible(false)}
                        footer={[
                            <Button key="back" type='default' onClick={() => {
                                this.setModalVisible(false)
                            }}>取消</Button>,
                            <Button key="submit" type="primary" onClick={() => {
                                this.clickOk()
                            }}>确定</Button>
                        ]}
                    >
                    <div className="clearfix">
                        {
                            this.state.roleData.map((item, index) => {
                                return (
                                    <span key={index} className={item.is_choose == true ? "roleItem1" : "roleItem"}
                                          onClick={() => this.chooseRole(index)}>
                                        {item.employee_name}
                                    </span>
                                )
                            })
                        }
                    </div>
                </Modal>
                </Row>
            </span>
        )
    };

    componentDidMount() {

    }

    handleGetRoleData() {
        let data = this.props.data;
        app.post(roleAssignment.SEARCH_EMPLOYEELIST, {page: 1, size: 1000}).then((result) => {
            if (result.code === 1) {
                let roleData = result.data.dataSet;
                for (let i = 0; i < roleData.length; i++) {
                    for (let j = 0; j < data.length; j++) {
                        if (roleData[i].employee_id === data[j].employee_id) {
                            roleData[i].is_choose = true;
                        }
                    }
                }
                this.setState({roleData: roleData});
            } else {
                app.alert(result.msg, 'error', 3);
                this.setState({roleData: []});
            }
        });
    }

    setModalVisible(visible) {
        if (visible) {
            this.handleGetRoleData();
        }
        this.setState({
            editVisible: visible
        });
    };

    chooseRole(index) {
        let data = this.state.roleData;
        let is_choose = !data[index].is_choose;
        data[index].is_choose = is_choose;
        this.setState({roleData: data});
    }

    clickOk() {
        this.setState({confirmLoading: true});
        let data = this.state.roleData;
        let chooseData = [];
        for (let i = 0; i < data.length; i++) {
            if (data[i].is_choose === true) {
                chooseData.push(data[i].employee_id);
            }
        }
        let submitData = {
            duty_type: this.props.type,
            employee_id: JSON.stringify(chooseData)
        };
        app.post(roleAssignment.UPDATE_DUTYEMPLOYEE, submitData).then((result) => {
            if (result.code === 1) {
                app.alert('编辑成功', 'success', 3);
                this.props.handleGetEmployee();
                this.setModalVisible(false);
            } else {
                app.alert(result.msg, 'success', 3);
            }
            this.setState({confirmLoading: false});
        })
    }
};
const EditRoles = Form.create()(EditRole);

//修改订单
class EditOrder extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}} onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='请输入'
                    width="400px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                <FormItem label="实际件数" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('output_real_package')(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                                 <FormItem label="实际散件数" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('output_real_parts')(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                                 <FormItem label="状态" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('output_status', {
                                            rules: [{required: true, message: '请选择状态'}]
                                        })(
                                            <Select placeholder="请选择">
                                                <Option value='0'>待接单</Option>
                                                <Option value='1'>已接单</Option>
                                                <Option value='2'>配货中</Option>
                                                <Option value='3'>待对货</Option>
                                                <Option value='4'>待配送</Option>
                                                <Option value='5'>待改单</Option>
                                                <Option value='6'>配送中</Option>
                                                <Option value='7'>已完成</Option>
                                            </Select>
                                        )
                                    }
                                </FormItem>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = {
                output_status: this.props.data.output_status,
                output_real_package: this.props.data.output_real_package,
                output_real_parts: this.props.data.output_real_parts
            };
            this.props.form.setFieldsValue(data);
        }
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        const _this = this;
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    output_id: this.props.data.output_id,
                    output_status: values.output_status,
                    output_real_parts: values.output_real_parts,
                    output_real_package: values.output_real_package
                };
                app.post(outbound.UPDATE_OUTPUTSTATUS, data).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        this.props.handleRefresh();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                });
                _this.setModalVisible(false);
            }
        })
    }
};
const EditOrders = Form.create()(EditOrder);

class EditCar extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            editVisible1: false,
            editConfirmLoading1: false,
            data: [],
            searchData: {}
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };
    columns = [
        {
            title: '订单号',
            dataIndex: 'output_num'
        },
        {
            title: '跟单人',
            dataIndex: 'output_follow_name'
        },
        {
            title: '客户名',
            dataIndex: 'customer_name'
        },
        {
            title: '订单金额(元)',
            dataIndex: 'output_money'
        },
        {
            title: '应收款(元)',
            dataIndex: 'output_need_money'
        },
        {
            title: '已收款(元)',
            dataIndex: 'output_real_money'
        },
        {
            title: '自定义优先级',
            dataIndex: 'car_custom_sort'
        },
        {
            title: '推荐优先级',
            dataIndex: 'car_recommend_sort'
        },
        {
            title: '实际件数',
            dataIndex: 'output_real_package'
        },
        {
            title: '实际散件数',
            dataIndex: 'output_real_parts'
        },
        {
            title: '状态',
            dataIndex: 'output_status',
            render: output_status => {
                let text;
                if (output_status == 0) {
                    text = '待接单';
                } else if (output_status == 1) {
                    text = '已接单';
                } else if (output_status == 2) {
                    text = '配货中';
                } else if (output_status == 3) {
                    text = '待对货';
                } else if (output_status == 4) {
                    text = '待配送';
                } else if (output_status == 5) {
                    text = '待改单';
                } else if (output_status == 6) {
                    text = '配送中';
                } else if (output_status == 7) {
                    text = '已完成';
                }
                return (
                    <span>{text}</span>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns,
            render: data => {
                return (
                    <span>

                        {
                            data.output_status == 7 ?
                                <CheckOrderImg output_id={data.output_id} imgUrl={data.output_finish_photo}/> :
                                <span>
                                    <span style={{color: '#1890ff', cursor: 'pointer'}}
                                          onClick={() => this.handleUp(data.output_id)}>{'上移'}</span>
                                    <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '5px'}}
                                          onClick={() => this.handleDown(data.output_id)}>{'下移'}</span>
                                    <EditLogisticsOrders output_id={data.output_id}
                                                         handleRefresh={() => this.handleGetList()}/>
                                    <span style={{color: '#ff001f', cursor: 'pointer', marginLeft: '5px'}}
                                          onClick={() => this.handleDel(data.output_id)}>{'删除'}</span>
                                </span>
                        }
                    </span>
                )
            }
        }
    ];

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>详情</span>
                <Modal
                    maskClosable={true}
                    visible={this.state.editVisible}
                    confirmLoading={this.state.editConfirmLoading}
                    wrapClassName="vertical-center-modal"
                    title="物流详情"
                    width="1500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button type="primary" key="confirm" onClick={() => this.handleSave()}>确定</Button>
                    ]}
                >
                    <Row>
                        <Row>
                            <ButtonSubmit
                                title="添加订单"
                                buttonText="添加"
                                float={'left'}
                                click={(e) => this.setModal2Visible(true)}
                                width="500px"
                                isVisible={this.state.editVisible1}
                                clickCancel={(e) => this.setModal2Visible(false)}
                                addConfirmLoading={this.state.editConfirmLoading1}
                                clickOk={() => this.handleSubmit()}
                            >
                                <Row>
                                    <Form>
                                        <FormItem label="订单号" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('order_number', {
                                                    rules: [{required: true, message: '请输入订单号'}]
                                                })(
                                                    <Input placeholder="请输入" onChange={(e) => this.handleOnChange(e)}/>
                                                )
                                            }
                                        </FormItem>
                                        <Row>
                                            <Col offset={3}
                                                 span={10}>客户名：{this.state.searchData.output_consumer_name}</Col>
                                            <Col offset={1}
                                                 span={10}>下单时间：{this.state.searchData.output_order_time}</Col>
                                        </Row>
                                        <Row style={{marginTop: '20px'}}>
                                            <Col offset={3}
                                                 span={10}>跟单人：{this.state.searchData.output_follow_name}</Col>
                                            <Col offset={1}
                                                 span={10}>跟单人电话：{this.state.searchData.output_follow_phone}</Col>
                                        </Row>
                                    </Form>
                                </Row>
                            </ButtonSubmit>
                        </Row>
                        <Row style={{marginTop: '10px'}}>
                            <Table
                                loading={this.state.loading}
                                columns={this.columns}
                                rowKey={record => record.output_id}
                                dataSource={this.state.data}
                                pagination={false}
                            >
                            </Table>
                        </Row>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            this.handleGetList();
        }
        this.setState({editVisible: visible});
    };

    handleGetList() {
        let id = this.props.car_id;
        this.setState({loading: true});
        app.post(car.SEARCH_CARDETAILLIST, {car_id: id}).then((result) => {
            if (result.code === 1) {
                let data = result.data.dataSet;
                this.setState({loading: false, data});
            } else {
                this.setState({loading: false, data: []});
                app.alert(result.msg, 'error', 3);
            }
        })
    }

    setModal2Visible(visible) {
        this.setState({editVisible1: visible});
    };

    //删除
    handleDel(id) {
        const _this = this;
        confirm({
            title: '',
            content: '是否删除该订单？',
            onOk: function () {
                let car_id = _this.props.car_id;
                app.post(car.DELETE_CAROUTPUT, {car_id: car_id, output_id: id}).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        _this.handleGetList();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            },
            onCancel: function () {

            }
        });
    };

    //上移
    handleUp(id) {
        let data = this.state.data;
        let index;
        for (let i = 0; i < data.length; i++) {
            if (data[i].output_id == id) {
                index = i;
                break;
            }
        }
        if (index == 0) {
            app.alert('优先级已达到最高', 'error', 3);
            return;
        }
        let car_custom_sort1 = data[index].car_custom_sort;
        let car_custom_sort2 = data[index - 1].car_custom_sort;
        let temp = {};
        temp = data[index - 1];
        temp.car_custom_sort = car_custom_sort1;
        data[index - 1] = data[index];
        data[index - 1].car_custom_sort = car_custom_sort2;
        data[index] = temp;
        this.setState({data});
    };

    //下移
    handleDown(id) {
        let data = this.state.data;
        let index;
        for (let i = 0; i < data.length; i++) {
            if (data[i].output_id == id) {
                index = i;
                break;
            }
        }
        if (index == data.length - 1) {
            app.alert('优先级已达到最低', 'error', 3);
            return;
        }
        let car_custom_sort1 = data[index].car_custom_sort;
        let car_custom_sort2 = data[index + 1].car_custom_sort;
        let temp = {};
        temp = data[index + 1];
        temp.car_custom_sort = car_custom_sort1;
        data[index + 1] = data[index];
        data[index + 1].car_custom_sort = car_custom_sort2;
        data[index] = temp;
        this.setState({data});
    };

    //保存自定义排序
    handleSave() {
        let id = this.props.car_id;
        let outputList = [];
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            let item = {};
            item.output_id = data[i].output_id;
            item.car_custom_sort = data[i].car_custom_sort;
            outputList.push(item);
        }
        app.post(car.UPDATE_CARCUSTOMESORT, {car_id: id, outputList: JSON.stringify(outputList)}).then((result) => {
            if (result.code) {
                app.alert(result.msg, 'success', 3);
                this.setModalVisible(false);
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })
    };

    //查找订单详情
    handleOnChange(e) {
        let output_num = e.target.value;
        app.post(car.SEARCH_OUTPUTDETAIL, {output_num: output_num}).then((result) => {
            if (result.code === 1) {
                let data = result.data;
                let searchData = {};
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_follow_name = data.output_follow_name;
                searchData.output_order_time = moment(data.output_order_time).format('YYYY-MM-DD');
                searchData.output_id = data.output_id;
                this.setState({searchData});
            } else {
                this.setState({searchData: {}});
            }
        })
    };

    handleSubmit() {
        let id = this.props.car_id;
        let output_id = this.state.searchData.output_id;
        if (output_id == undefined || output_id.length <= 0) {
            app.alert('请搜索要添加的订单', 'error', 3);
            return;
        }
        app.post(car.ADD_CAROUTPUT, {car_id: id, output_id: output_id}).then((result) => {
            if (result.code === 1) {
                app.alert(result.msg, 'success', 3);
                this.setModal2Visible(false);
                this.handleGetList();
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })
    }
};
const EditCars = Form.create()(EditCar);

/**
 * 送市场详情组件
 */

class EditMarketCar extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            editVisible1: false,
            editConfirmLoading1: false,
            data: [],
            searchData: {}
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };
    columns = [
        {
            title: '订单号',
            dataIndex: 'output_num'
        },
        {
            title: '跟单人',
            dataIndex: 'output_follow_name'
        },
        {
            title: '客户名',
            dataIndex: 'customer_name'
        },
        {
            title: '订单金额(元)',
            dataIndex: 'output_money'
        },
        {
            title: '应收款(元)',
            dataIndex: 'output_need_money'
        },
        {
            title: '已收款(元)',
            dataIndex: 'output_real_money'
        },
        {
            title: '客户车牌号',
            dataIndex: 'output_customer_car'
        },
        {
            title: '停靠位置',
            dataIndex: 'output_stop_position'
        },
        {
            title: '实际件数',
            dataIndex: 'output_real_package'
        },
        {
            title: '实际散件数',
            dataIndex: 'output_real_parts'
        },
        {
            title: '状态',
            dataIndex: 'output_status',
            render: output_status => {
                let text;
                if (output_status == 0) {
                    text = '待接单';
                } else if (output_status == 1) {
                    text = '已接单';
                } else if (output_status == 2) {
                    text = '配货中';
                } else if (output_status == 3) {
                    text = '待对货';
                } else if (output_status == 4) {
                    text = '待配送';
                } else if (output_status == 5) {
                    text = '待改单';
                } else if (output_status == 6) {
                    text = '配送中';
                } else if (output_status == 7) {
                    text = '已完成';
                }
                return (
                    <span>{text}</span>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns,
            render: data => {
                return (
                    <span>


                        {
                            data.output_status == 7 ?
                                <CheckOrderImg output_id={data.output_id} imgUrl={data.output_finish_photo}/> :
                                <span>
                                    <EditCarPositions data={data} handleRefresh={() => this.handleGetList()}/>
                        <EditLogisticsOrders output_id={data.output_id} handleRefresh={() => this.handleGetList()}/>
                                    <span style={{color: '#ff001f', cursor: 'pointer', marginLeft: '5px'}}
                                          onClick={() => this.handleDel(data.output_id)}>{'删除'}</span>
                                </span>
                        }
                    </span>
                )
            }
        }
    ];

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>详情</span>
                <Modal
                    maskClosable={true}
                    visible={this.state.editVisible}
                    confirmLoading={this.state.editConfirmLoading}
                    wrapClassName="vertical-center-modal"
                    title="物流详情"
                    width="1500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button type="primary" key="confirm" onClick={() => this.handleSave()}>确定</Button>
                    ]}
                >
                    <Row>
                        <Row>
                            <ButtonSubmit
                                title="添加订单"
                                buttonText="添加"
                                float={'left'}
                                click={(e) => this.setModal2Visible(true)}
                                width="500px"
                                isVisible={this.state.editVisible1}
                                clickCancel={(e) => this.setModal2Visible(false)}
                                addConfirmLoading={this.state.editConfirmLoading1}
                                clickOk={() => this.handleSubmit()}
                            >
                                <Row>
                                    <Form>
                                        <FormItem label="订单号" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('order_number', {
                                                    rules: [{required: true, message: '请输入订单号'}]
                                                })(
                                                    <Input placeholder="请输入" onChange={(e) => this.handleOnChange(e)}/>
                                                )
                                            }
                                        </FormItem>
                                        <Row>
                                            <Col offset={3}
                                                 span={10}>客户名：{this.state.searchData.output_consumer_name}</Col>
                                            <Col offset={1}
                                                 span={10}>下单时间：{this.state.searchData.output_order_time}</Col>
                                        </Row>
                                        <Row style={{marginTop: '20px'}}>
                                            <Col offset={3}
                                                 span={10}>跟单人：{this.state.searchData.output_follow_name}</Col>
                                            <Col offset={1}
                                                 span={10}>跟单人电话：{this.state.searchData.output_follow_phone}</Col>
                                        </Row>
                                    </Form>
                                </Row>
                            </ButtonSubmit>
                        </Row>
                        <Row style={{marginTop: '10px'}}>
                            <Table
                                loading={this.state.loading}
                                columns={this.columns}
                                rowKey={record => record.output_id}
                                dataSource={this.state.data}
                                pagination={false}
                            >
                            </Table>
                        </Row>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            this.handleGetList();
        }
        this.setState({editVisible: visible});
    };

    handleGetList() {
        let id = this.props.car_id;
        this.setState({loading: true});
        app.post(car.SEARCH_CARDETAILLIST, {car_id: id}).then((result) => {
            if (result.code === 1) {
                let data = result.data.dataSet;
                this.setState({loading: false, data});
            } else {
                this.setState({loading: false, data: []});
                app.alert(result.msg, 'error', 3);
            }
        })
    }

    setModal2Visible(visible) {
        this.setState({editVisible1: visible});
    };

    //删除
    handleDel(id) {
        const _this = this;
        confirm({
            title: '',
            content: '是否删除该订单？',
            onOk: function () {
                let car_id = _this.props.car_id;
                app.post(car.DELETE_CAROUTPUT, {car_id: car_id, output_id: id}).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        _this.handleGetList();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            },
            onCancel: function () {

            }
        });
    };

    //保存自定义排序
    handleSave() {
        let id = this.props.car_id;
        let outputList = [];
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            let item = {};
            item.output_id = data[i].output_id;
            item.car_custom_sort = data[i].car_custom_sort;
            outputList.push(item);
        }
        app.post(car.UPDATE_CARCUSTOMESORT, {car_id: id, outputList: JSON.stringify(outputList)}).then((result) => {
            if (result.code) {
                app.alert(result.msg, 'success', 3);
                this.setModalVisible(false);
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })
    };

    //查找订单详情
    handleOnChange(e) {
        let output_num = e.target.value;
        app.post(car.SEARCH_OUTPUTDETAIL, {output_num: output_num}).then((result) => {
            if (result.code === 1) {
                let data = result.data;
                let searchData = {};
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_follow_name = data.output_follow_name;
                searchData.output_order_time = moment(data.output_order_time).format('YYYY-MM-DD');
                searchData.output_id = data.output_id;
                this.setState({searchData});
            } else {
                this.setState({searchData: {}});
            }
        })
    };

    handleSubmit() {
        let id = this.props.car_id;
        let output_id = this.state.searchData.output_id;
        if (output_id == undefined || output_id.length <= 0) {
            app.alert('请搜索要添加的订单', 'error', 3);
            return;
        }
        app.post(car.ADD_CAROUTPUT, {car_id: id, output_id: output_id}).then((result) => {
            if (result.code === 1) {
                app.alert(result.msg, 'success', 3);
                this.setModal2Visible(false);
                this.handleGetList();
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })
    }
};
const EditMarketCars = Form.create()(EditMarketCar);

class CheckOrderImg extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            imgUrlData: []
        }
    };

    render() {
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '5px'}}
                      onClick={() => this.setModalVisible(true)}>查看照片</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='查看图片'
                    width="600px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.setModalVisible(false)}>确定</Button>,
                    ]}
                >
                    <Row>
                        {
                            this.state.imgUrlData.map((item, index) => {
                                return (
                                    <div className="imgItem" key={index}>
                                        <div style={{width: '100%', height: '100%', position: 'relative'}}>
                                            <div className="barrierBed">
                                                <ImgItem imgUrl={item}/>
                                            </div>
                                            <img alt="null" src={config.imgServerUrl + item}
                                                 style={{width: '100%', height: '100%'}}/>
                                        </div>
                                    </div>
                                )
                            })
                        }
                    </Row>
                </Modal>
            </span>
        )
    };

    /**
     * 显示和隐藏弹框
     * @param visible
     */
    setModalVisible(visible) {
        if (visible) {
            let imgUrl = this.props.imgUrl;
            if (!imgUrl) {
                app.alert('没有图片', 'error', 2);
                return;
            }
            let data = imgUrl.split(',');
            this.setState({imgUrlData: data});
        }
        this.setState({
            editVisible: visible
        })
    };
}

class ImgItem extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            imgUrlData: []
        }
    };

    render() {
        return (
            <span>
                <Icon type="eye-o" title="查看图片" style={{
                    fontSize: '18px',
                    color: '#fff',
                    position: 'absolute',
                    top: '36px',
                    left: '36px'
                }} onClick={() => this.setModalVisible(true)}/>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='查看图片'
                    width="600px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.setModalVisible(false)}>确定</Button>,
                    ]}
                >
                    <Row>
                        <img alt="null" src={config.imgServerUrl + this.props.imgUrl}
                             style={{width: '100%', height: '500px'}}/>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        this.setState({
            editVisible: visible
        })
    };
}

class EditLogisticsOrder extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '5px'}}
                      onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='请输入'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                <FormItem label="实际件数" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('output_real_package', {
                                            rules: [{required: true, message: '请输入实际件数'}]
                                        })(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                                <FormItem label="实际散件数" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('output_real_parts', {
                                            rules: [{required: true, message: '请输实际散件数'}]
                                        })(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    output_id: this.props.output_id,
                    output_real_package: values.output_real_package,
                    output_real_parts: values.output_real_parts,
                };
                console.log(data);
                app.post(car.UPDATE_OUTPUTPACKAGE, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('修改成功', 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleRefresh();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
}

const EditLogisticsOrders = Form.create()(EditLogisticsOrder);

class EditAdmin extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}} onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='请输入'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="账号" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('username', {
                                                    rules: [{required: true, message: '请输入账号'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="密码" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('password')(
                                                    <Input placeholder="请输入" type="password"/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="角色" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('role_id', {
                                                    rules: [{required: true, message: '请选择角色'}]
                                                })(
                                                    <Select placeholder="请选择角色">
                                                        {
                                                            this.props.roleItem.map((item) => {
                                                                return (
                                                                    <Option key={item.role_id}
                                                                            value={item.role_id}>{item.role_name}</Option>
                                                                )
                                                            })
                                                        }
                                                    </Select>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="昵称" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('nickname', {
                                                    rules: [{required: true, message: '请输入昵称'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    /**
     * 显示和隐藏弹框
     * @param visible
     */
    setModalVisible(visible) {
        if (visible) {
            let data = {
                username: this.props.data.admin_username,
                nickname: this.props.data.admin_nickname,
                role_id: this.props.data.role_id
            };
            this.props.form.setFieldsValue(data);
        }
        this.setState({
            editVisible: visible
        })
    };

    /**
     * 处理完成编辑事件
     */
    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    admin_id: this.props.data.admin_id,
                    admin_username: values.username,
                    admin_password: values.password,
                    role_id: values.role_id,
                    admin_nickname: values.nickname
                };
                app.post(requestUrl.UPDATE_ADMIN, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('修改成功', 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleEdit();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
};
const EditAdmins = Form.create()(EditAdmin);

//修改打印机
class EditPrinter extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer',marginLeft:10}} onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='请输入'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                <FormItem label="打印机别名" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('printer_name', {
                                            rules: [{required: true, message: '请输入打印机别名'}]
                                        })(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                                <FormItem label="打印机ip" {...this.formItemLayout}>
                                    {
                                        getFieldDecorator('printer_ip', {
                                            rules: [{required: true, message: '请输入打印机ip'}]
                                        })(
                                            <Input placeholder="请输入"/>
                                        )
                                    }
                                </FormItem>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    /**
     * 显示和隐藏弹框
     * @param visible
     */
    setModalVisible(visible) {
        if (visible) {
            let data = {
                printer_name: this.props.data.printer_name,
                printer_ip: this.props.data.printer_ip
            };
            this.props.form.setFieldsValue(data);
        }
        this.setState({
            editVisible: visible
        })
    };

    /**
     * 处理完成编辑事件
     */
    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    printer_id: this.props.data.printer_id,
                    printer_name: values.printer_name,
                    printer_ip: values.printer_ip
                };
                app.post(printer.UPDATE_PRINTER, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('修改成功', 'success', 2);
                        this.setModalVisible(false);
                        this.props.handleEdit();
                    } else {
                        app.alert(result.msg, 'error', 2);
                    }
                })
            }
        })
    }
};
const EditPrinters = Form.create()(EditPrinter);

class EditRoleManage extends Component {
    constructor(props) {
        super(props);
        this.state = {
            text: '',
            title: '',
            roleList: this.props.data.roleList,
            menuList: [],
            role_name: '',
            modal2Visible: false,
            halfCheckedKeys: [],//半选的复选框
            roleHelp: '',
            roleStatus: '',
            editConfirmLoading: false,
            menu_id: []
        }
    };

    formItemLayout = {
        labelCol: {span: 10},
        wrapperCol: {span: 12}
    };

    render() {
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}}
                      onClick={() => this.setModal2Visible(true)}>编辑</span>
                <Modal
                    title={this.props.title}
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    width={this.props.width}
                    visible={this.state.modal2Visible}
                    confirmLoading={this.state.editConfirmLoading}
                    onOk={(e) => this.handleEditSubmit(e)}
                    onCancel={() => this.setModal2Visible(false)}
                >
                    <Row>
                        <Col offset={1} span={18}>
                            <Form className="login-form">
                                <FormItem label="角色名" {...this.formItemLayout}>
                                    <span>{this.props.data.role_name}</span>
                                </FormItem>
                                <FormItem label="权限" help={this.state.roleHelp}
                                          validateStatus={this.state.roleStatus}
                                          required={true} {...this.formItemLayout}
                                >
                                    <Layout style={{height: '100%', width: '200px'}}>
                                        <Content style={{height: '450px', overflow: 'scroll'}}>
                                            <MenuList
                                                roleList={this.state.roleList}
                                                menuList={this.props.menuList}
                                                update={(select, menuList) => this.UpdateMenu(select, menuList)}
                                            />
                                        </Content>
                                    </Layout>
                                </FormItem>
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModal2Visible(visible) {
        let roleId = this.props.data.role_id;
        let isUpdate = false;
        if (visible) {
            app.post(menu.SEARCH_MENU_BY_ROLEID, {role_id: roleId}).then(req => {
                if (req.code == 1) {
                    let firstMenuList = [];
                    let secondMenuList = [];
                    let halfCheckedKeys = [];
                    let occurMenuList = [];
                    let allMenuList = this.props.menuList;//所有菜单
                    console.log(req.data.dataSet);
                    req.data.dataSet.forEach((item) => {
                        if (!item.menu_parentid) {
                            firstMenuList.push(item.menu_id);//所有一级菜单
                        } else {
                            secondMenuList.push(item.menu_id);//除一级之外的所有菜单
                        }
                    });
                    //除掉含有下级菜单的一级菜单，防止新添加菜单也会被默认选中
                    for (let i = firstMenuList.length - 1; i >= 0; i--) {
                        allMenuList.forEach((allItem, allIndex) => {
                            if (allItem.subList) {
                                if (allItem.menu_id == firstMenuList[i]) {
                                    halfCheckedKeys.push(firstMenuList[i]);//半选中的菜单
                                    firstMenuList.splice(i, 1);//除去含有下级菜单的一级菜单
                                }
                            }
                        })
                    }

                    occurMenuList = secondMenuList.concat(firstMenuList);
                    this.setState({
                        roleList: occurMenuList,//复选框选中的菜单
                        halfCheckedKeys: halfCheckedKeys //半选中的菜单
                    })
                }
            })
        }
        ;
        this.setState({
            modal2Visible: visible,
            isUpdate: isUpdate
        })
    };

    UpdateMenu(select, menuList) {
        let roleHelp = '';
        let roleStatus = '';
        if (select.length <= 0) {
            roleStatus = 'error';
            roleHelp = '请选择权限';
        }
        this.setState({
            roleList: select,
            menu_id: menuList,
            roleHelp: roleHelp,
            roleStatus: roleStatus
        })
    };

    handleEditSubmit(e) {
        let menuData = this.state.menu_id;
        let len = menuData.length;
        let menu_id = "";
        for (let i = 0; i < len; i++) {
            menu_id += menuData[i] + ",";
        }
        if (menu_id.length > 0) {
            menu_id = menu_id.substr(0, menu_id.length - 1);
        }
        let data = {
            role_id: this.props.data.role_id,
            role_name: this.props.data.role_name,
            menu_id: menu_id,
        };
        console.log(data);
        app.post(menu.UPDATE_ROLE, data).then((result) => {
            if (result.code === 1) {
                app.alert("修改成功", 'success', 3);
                this.props.refresh();
                this.setModal2Visible(false);
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })
    }

}

//修改权限中所有的菜单显示
class MenuList extends Component {
    constructor(props) {
        super(props);
        this.state = {};
    }

    onCheck = (checkedKeys, info) => {
        const menuList = info.checkedNodes.map((item) => {
            return item.props.value.menu_id;
        });
        this.props.update(checkedKeys, menuList);
    };

    render() {
        const loop = (data) => data.map((item, index) => {
            if (item.subList) {
                return <TreeNode title={item.menu_name} key={item.menu_id} value={item}>{loop(item.subList)}</TreeNode>
            }
            if (item.menu_key) {
                return <TreeNode title={item.menu_name} key={item.menu_id} value={item} isLeaf={true}/>
            }
            return <TreeNode title={item.menu_name} key={item.menu_id} value={item} isLeaf={true}/>
        });
        return (
            <span>
                <Tree
                    checkable
                    onCheck={this.onCheck}
                    checkedKeys={this.props.roleList}
                >
                    {loop(this.props.menuList)}
                </Tree>
            </span>
        )
    }
}

class EditLogistic extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}} onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='修改物流公司'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="物流公司" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('logistics_name', {
                                                    rules: [{required: true, message: '请输入物流公司'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="地址" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('logistics_address', {
                                                    rules: [{required: true, message: '请输入地址'}]
                                                })(
                                                    <Input placeholder="请输入" type="text"/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="电话" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('logistics_phone', {
                                                    rules: [{required: true, message: '请输入电话'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = {
                logistics_name: this.props.data.logistics_name,
                logistics_address: this.props.data.logistics_address,
                logistics_phone: this.props.data.logistics_phone
            };
            this.props.form.setFieldsValue(data);
        }
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    logistics_id: this.props.data.logistics_id,
                    logistics_name: values.logistics_name,
                    logistics_address: values.logistics_address,
                    logistics_phone: values.logistics_phone
                };
                app.post(logistics.UPDATE_LOGISTICS, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('修改成功', 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleEdit();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
};
const EditLogistics = Form.create()(EditLogistic);

class ConfirmCheck extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            logisticsList: [],
            orderList: []
        }
    };

    formItemLayout = {
        labelCol: {span: 12},
        wrapperCol: {span: 8}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <Button type='primary' style={{marginLeft: '10px'}}
                        onClick={() => this.setModalVisible(true)}>托运</Button>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='确认托运'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                        <Col offset={1} span={22}>
                            <Form className="login-form">
                                {
                                    this.state.orderList.map((item, index) => {
                                        return (
                                            <FormItem key={index}
                                                      label={"(" + item.output_num + ") 物流公司"} {...this.formItemLayout}>
                                                {
                                                    getFieldDecorator(item.output_id, {
                                                        rules: [{required: true, message: '请选择物流公司'}]
                                                    })(
                                                        <Select placeholder="请选择物流公司">
                                                            {
                                                                this.state.logisticsList.map((item, index) => {
                                                                    return (
                                                                        <Option key={index}
                                                                                value={item.logistics_id}>{item.logistics_name}</Option>
                                                                    )
                                                                })
                                                            }
                                                        </Select>
                                                    )
                                                }
                                            </FormItem>
                                        )
                                    })
                                }
                            </Form>
                        </Col>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let selectedRowKeys = this.props.selectedRowKeys;
            if (selectedRowKeys == undefined || selectedRowKeys.length <= 0) {
                app.alert('请选择订单！', 'error', 3);
                return;
            }
            let orderList = [];
            for (let i = 0; i < selectedRowKeys.length; i++) {
                let item = JSON.parse(selectedRowKeys[i]);
                orderList.push(item);
            }
            this.setState({orderList});
        }
        this.setState({
            editVisible: visible
        })
    };

    componentDidMount() {
        this.handleSearchLogistics();
    }

    handleSearchLogistics(data = {page: 1, size: 100}) {
        app.post(logistics.SEARCH_LOGISTICSLIST, data).then((result) => {
            if (result.code === 1) {
                this.setState({logisticsList: result.data.dataSet});
            } else {
                this.setState({data: [], loading: false});
            }
        })
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let outputList = [];
                for (let key in values) {
                    let item = {};
                    item.output_id = key;
                    item.logistics_id = values[key];
                    outputList.push(item);
                }
                let data = {};
                data.outputList = JSON.stringify(outputList);
                app.post(car.CONFIRMCHECK, data).then((result) => {
                    if (result.code === 1) {
                        app.alert('托运成功', 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleReset();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
}

const ConfirmChecks = Form.create()(ConfirmCheck);


class SendExpress extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            logisticsList: [],
            orderList: [],
            helpStr: '',
            statusStr: '',
            chooseData: {}
        }
    };

    formItemLayout = {
        labelCol: {span: 12},
        wrapperCol: {span: 8}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <Button type='primary' style={{marginLeft: '10px'}}
                        onClick={() => this.setModalVisible(true)}>填写快递单号</Button>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='填写快递'
                    width="600px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="快递公司" {...this.formItemLayout}
                                                  help={this.state.helpStr}
                                                  required={true}
                                                  validateStatus={this.state.statusStr}
                                        >
                                            {this.state.chooseData.express_name}
                                            <ChooseLogistics choose={(data) => this.handleChoose(data)}/>
                                        </FormItem>
                                        {
                                            this.state.orderList.map((item, index) => {
                                                return (
                                                    <FormItem key={index}
                                                              label={"(" + item.output_num + ") 快递单号"} {...this.formItemLayout}>
                                                        {
                                                            getFieldDecorator(item.output_id, {
                                                                rules: [{required: true, message: '请输入快递单号'}]
                                                            })(
                                                                <Input placeholder="请输入"/>
                                                            )
                                                        }
                                                    </FormItem>
                                                )
                                            })
                                        }
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let selectedRowKeys = this.props.selectedRowKeys;
            if (selectedRowKeys == undefined || selectedRowKeys.length <= 0) {
                app.alert('请选择订单！', 'error', 3);
                return;
            }
            let orderList = [];
            for (let i = 0; i < selectedRowKeys.length; i++) {
                let item = JSON.parse(selectedRowKeys[i]);
                orderList.push(item);
            }
            this.setState({orderList});
        }
        this.setState({
            editVisible: visible
        })
    };

    componentDidMount() {
        this.handleSearchLogistics();
    }

    handleSearchLogistics(data = {page: 1, size: 100}) {
        app.post(logistics.SEARCH_LOGISTICSLIST, data).then((result) => {
            if (result.code === 1) {
                this.setState({logisticsList: result.data.dataSet});
            } else {
                this.setState({data: [], loading: false});
            }
        })
    };

    clickOk() {
        let chooseData = this.state.chooseData;
        let express_id = chooseData.express_id;
        if (express_id == undefined || express_id == null || express_id.length <= 0) {
            this.setState({
                helpStr: '请选择快递公司',
                statusStr: 'error',
            });
            return;
        } else {
            this.setState({
                helpStr: '',
                statusStr: '',
            });
        }
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let outputList = [];
                let selectedRowKeys = this.props.selectedRowKeys;
                let output_id_lists = [];
                for (let i = 0; i < selectedRowKeys.length; i++) {
                    let item = JSON.parse(selectedRowKeys[i]);
                    let output_id = item.output_id;
                    output_id_lists.push(output_id);
                }
                for (let i = 0; i < output_id_lists.length; i++) {
                    let item = {};
                    for (let key in values) {
                        if (output_id_lists[i] === key) {
                            item.output_id = output_id_lists[i];
                            item.output_express_no = values[key];
                            break;
                        }
                    }
                    outputList.push(item);
                }
                let data = {
                    logistics_id: chooseData.express_id,
                    car_logistics_name: chooseData.express_name,
                    outputList: JSON.stringify(outputList)
                };
                app.post(car.SENDEXPRESS, data).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleReset();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    };

    handleChoose(data) {
        let chooseData = data;
        this.setState({chooseData});
        this.setState({
            helpStr: '',
            statusStr: '',
        });
    }
}

const SendExpresss = Form.create()(SendExpress);

//选择快递公司
class ChooseLogistic extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            roleData: [],
            type: this.props.type,
            chooseData: {},
            is_choose: -1,
            code: '',
        }
    };

    render() {
        return (
            <span>
                <a style={{marginLeft: '15px'}} onClick={() => this.setModalVisible(true)}>选择</a>
                <Row>
                    <Modal
                        maskClosable={true}
                        visible={this.state.editVisible}
                        editConfirmLoading={this.state.editConfirmLoading}
                        title="选择快递公司"
                        wrapClassName="vertical-center-modal"
                        width="600px"
                        onCancel={() => this.setModalVisible(false)}
                        footer={[
                            <Button key="back" type='default' onClick={() => {
                                this.setModalVisible(false)
                            }}>取消</Button>,
                            <Button key="submit" type="primary" onClick={() => {
                                this.clickOk()
                            }}>确定</Button>
                        ]}
                    >
                    <div className="clearfix">
                        {
                            this.state.roleData.map((item, index) => {
                                return (
                                    <ExpressItem data={item} key={index} index={index}
                                                 express_id={this.state.chooseData.express_id}
                                                 handleChoode={(item) => this.handleChoose(item)}/>
                                )
                            })
                        }
                    </div>
                </Modal>
                </Row>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            this.state.roleData = [];
            this.handleSearchExpress();
        }
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        let data = this.state.chooseData;
        let express_id = data.express_id;
        if (express_id == undefined || express_id == null || express_id.length <= 0) {
            app.alert('请选择快递公司', 'error', 3);
            return;
        }
        this.props.choose(data);
        this.setState({
            editVisible: false
        })
    };

    handleChoose(item) {
        let chooseData = item;
        this.setState({chooseData});
    };

    handleSearchExpress() {
        app.post(car.SEARCHEXPRESS, {type: '1'}).then((result) => {
            if (result.code === 1) {
                let data = result.data.dataSet;
                let temp = this.state.roleData;
                temp.push(data[0]);
                this.setState({roleData: temp});
            }
        });
        app.post(car.SEARCHEXPRESS, {type: '0'}).then((result) => {
            if (result.code === 1) {
                let temp = this.state.roleData;
                let data = result.data.dataSet;
                for (let i = 0; i < data.length; i++) {
                    temp.push(data[i]);
                }
                this.setState({roleData: temp});
            }
        })
    }
};
const ChooseLogistics = Form.create()(ChooseLogistic);

class ExpressItem extends Component {
    constructor(props) {
        super(props);
        this.state = {
            code: ''
        }
    };

    render() {
        const {type_name, type_list} = this.props.data;
        const express_id = this.props.express_id;
        return (
            <Row className="ExpressItemStyle">
                <Col span={4} className="ExpressItemStyle_left">{type_name}</Col>
                <Col span={20} className="ExpressItemStyle_right">
                    {
                        type_list.map((item, index) => {
                            return (
                                <span className={express_id === item.express_id ? "ExpressItem" : "ExpressItem1"}
                                      key={index} onClick={() => this.handleChoose(item)}>{item.express_name}</span>
                            )
                        })
                    }
                </Col>
            </Row>
        )
    };

    handleChoose(item) {
        this.props.handleChoode(item);
    }
};

class EditCarPosition extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            logisticsList: []
        }
    }

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>修改停靠位置</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='修改'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="客户车牌号" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('output_customer_car', {})(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label="停靠位置" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('output_stop_position', {})(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = this.props.data;
            let formData = {
                output_customer_car: data.output_customer_car,
                output_stop_position: data.output_stop_position
            };
            this.props.form.setFieldsValue(formData);
        }
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let output_id = this.props.data.output_id;
                values.output_id = output_id;
                console.log(values);
                app.post(car.UPDATE_CARPOSITION, values).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleRefresh();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
}

const EditCarPositions = Form.create()(EditCarPosition);

class EditCar1 extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            editVisible1: false,
            editConfirmLoading1: false,
            data: [],
            searchData: {},
            logisticsList: [],
            logistics_id: ''
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };
    columns = [
        {
            title: '订单号',
            dataIndex: 'output_num'
        },
        {
            title: '跟单人',
            dataIndex: 'output_follow_name'
        },
        {
            title: '客户名',
            dataIndex: 'customer_name'
        },
        {
            title: '物流公司',
            dataIndex: 'logistics_name',
        },
        {
            title: '托运单号',
            dataIndex: 'output_check_num',
        },
        {
            title: '托运费用',
            dataIndex: 'output_pay',
        },
        {
            title: '订单金额(元)',
            dataIndex: 'output_money'
        },
        {
            title: '实际件数',
            dataIndex: 'output_real_package'
        },
        {
            title: '实际散件数',
            dataIndex: 'output_real_parts'
        },
        {
            title: '备注',
            dataIndex: 'output_remark'
        },
        {
            title: '状态',
            dataIndex: 'output_status',
            render: output_status => {
                let text;
                if (output_status == 0) {
                    text = '待接单';
                } else if (output_status == 1) {
                    text = '已接单';
                } else if (output_status == 2) {
                    text = '配货中';
                } else if (output_status == 3) {
                    text = '待对货';
                } else if (output_status == 4) {
                    text = '待配送';
                } else if (output_status == 5) {
                    text = '待改单';
                } else if (output_status == 6) {
                    text = '配送中';
                } else if (output_status == 7) {
                    text = '已完成';
                }
                return (
                    <span>{text}</span>
                )
            }
        },
        {
            title: '收货状态',
            dataIndex: this.columns,
            render: data => {
                let text = '';
                if (data.output_is_receive == 0) {
                    text = "未确认收货"
                } else if (data.output_is_receive == 1) {
                    if (data.output_receive_type == 0) {
                        text = '客户已确认';
                    } else if (data.output_receive_type == 1) {
                        text = "管理员" + data.output_receive_name + "已确认";
                    }
                }
                return (
                    <span>{text}</span>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns,
            render: data => {
                return (
                    <span>
                        {
                            data.output_status == 7 ?
                                <span>
                                    <CheckOrderImg output_id={data.output_id} imgUrl={data.output_finish_photo}/>
                                    {
                                        data.output_is_receive == 0 ?
                                            <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '5px'}}
                                                  onClick={() => this.handleConfirmReceive(data.output_id)}>{'确认收货'}</span> : ''
                                    }
                                    <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '5px'}}
                                          onClick={() => this.handleSendMsgAgain(data.output_id)}>{'重发消息'}</span>
                                </span> :
                                <span>
                                    <span style={{color: '#1890ff', cursor: 'pointer'}}
                                          onClick={() => this.handleDetail(data.output_id)}>{'订单详情'}</span>
                                    <span style={{color: '#ff001f', cursor: 'pointer', marginLeft: '5px'}}
                                          onClick={() => this.handleDel(data.output_id)}>{'删除'}</span>
                                </span>
                        }
                    </span>
                )
            }
        }
    ];

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>详情</span>
                <Modal
                    maskClosable={true}
                    visible={this.state.editVisible}
                    confirmLoading={this.state.editConfirmLoading}
                    wrapClassName="vertical-center-modal"
                    title="托运详情"
                    width="1400px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button type="primary" key="confirm" onClick={() => this.handleSave()}>确定</Button>
                    ]}
                >
                    <Row>
                        <Row>
                            <ButtonSubmit
                                title="添加订单"
                                buttonText="添加"
                                float={'left'}
                                click={(e) => this.setModal2Visible(true)}
                                width="500px"
                                isVisible={this.state.editVisible1}
                                clickCancel={(e) => this.setModal2Visible(false)}
                                addConfirmLoading={this.state.editConfirmLoading1}
                                clickOk={() => this.handleSubmit()}
                            >
                                <Row>
                                    <Form>
                                        <FormItem label="订单号" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('order_number', {
                                                    rules: [{required: true, message: '请输入订单号'}]
                                                })(
                                                    <Input placeholder="请输入" onChange={(e) => this.handleOnChange(e)}/>
                                                )
                                            }
                                        </FormItem>
                                        <FormItem label={"物流公司"} {...this.formItemLayout}>
                                                {
                                                    getFieldDecorator("logistics_id", {
                                                        rules: [{required: true, message: '请选择物流公司'}]
                                                    })(
                                                        <Select placeholder="请选择物流公司"
                                                                onChange={this.handleOnChangeLogistics}>
                                                            {
                                                                this.state.logisticsList.map((item, index) => {
                                                                    return (
                                                                        <Option key={index}
                                                                                value={item.logistics_id}>{item.logistics_name}</Option>
                                                                    )
                                                                })
                                                            }
                                                        </Select>
                                                    )
                                                }
                                            </FormItem>
                                        <Row>
                                            <Col offset={3}
                                                 span={10}>客户名：{this.state.searchData.output_consumer_name}</Col>
                                            <Col offset={1}
                                                 span={10}>下单时间：{this.state.searchData.output_order_time}</Col>
                                        </Row>
                                        <Row style={{marginTop: '20px'}}>
                                            <Col offset={3}
                                                 span={10}>跟单人：{this.state.searchData.output_follow_name}</Col>
                                            <Col offset={1}
                                                 span={10}>跟单人电话：{this.state.searchData.output_follow_phone}</Col>
                                        </Row>
                                    </Form>
                                </Row>
                            </ButtonSubmit>
                        </Row>
                        <Row style={{marginTop: '10px'}}>
                            <Table
                                loading={this.state.loading}
                                columns={this.columns}
                                rowKey={record => record.output_id}
                                dataSource={this.state.data}
                                pagination={false}
                            >
                            </Table>
                        </Row>
                    </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            this.handleSearchLogistics();
            this.handleGetList();
        }
        this.setState({editVisible: visible});
    };

    /**
     * 查询物流公司数据
     * @param data
     */
    handleSearchLogistics(data = {page: 1, size: 100}) {
        app.post(logistics.SEARCH_LOGISTICSLIST, data).then((result) => {
            if (result.code === 1) {
                this.setState({logisticsList: result.data.dataSet});
            } else {
                this.setState({data: [], loading: false});
            }
        })
    };

    handleGetList() {
        let id = this.props.car_id;
        this.setState({loading: true});
        app.post(car.SEARCH_CARDETAILLIST, {car_id: id}).then((result) => {
            if (result.code === 1) {
                let data = result.data.dataSet;
                this.setState({loading: false, data});
            } else {
                this.setState({loading: false, data: []});
                app.alert(result.msg, 'error', 3);
            }
        })
    }

    setModal2Visible(visible) {
        this.setState({editVisible1: visible});
    };

    //删除
    handleDel(id) {
        const _this = this;
        confirm({
            title: '',
            content: '是否删除该订单？',
            onOk: function () {
                let car_id = _this.props.car_id;
                app.post(car.DELETE_CAROUTPUT, {car_id: car_id, output_id: id}).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        _this.handleGetList();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            },
            onCancel: function () {

            }
        });
    };

    handleSave() {
        this.setModalVisible(false);
    };

    //查找订单详情
    handleOnChange(e) {
        let output_num = e.target.value;
        app.post(car.SEARCH_OUTPUTDETAIL, {output_num: output_num}).then((result) => {
            if (result.code === 1) {
                let data = result.data;
                let searchData = {};
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_consumer_name = data.output_consumer_name;
                searchData.output_follow_name = data.output_follow_name;
                searchData.output_order_time = moment(data.output_order_time).format('YYYY-MM-DD');
                searchData.output_id = data.output_id;
                this.setState({searchData});
            } else {
                this.setState({searchData: {}});
            }
        })
    };

    /**
     * 处理提交事件
     */
    handleSubmit() {
        let id = this.props.car_id;
        let output_id = this.state.searchData.output_id;
        let logistics_id = this.state.logistics_id;
        if (output_id == undefined || output_id.length <= 0) {
            app.alert('请搜索要添加的订单', 'error', 2);
            return;
        }
        if (logistics_id == undefined || logistics_id.length <= 0) {
            app.alert('请选择物流公司', 'error', 2);
            return;
        }
        app.post(car.ADD_CAROUTPUT, {car_id: id, output_id: output_id, logistics_id: logistics_id}).then((result) => {
            if (result.code === 1) {
                app.alert(result.msg, 'success', 2);
                this.setModal2Visible(false);
                this.handleGetList();
            } else {
                app.alert(result.msg, 'error', 2);
            }
        })
    };

    //查询订单详情
    handleDetail(id) {
        this.props.handleDetail(id);
    };

    /**
     * 处理物流公司选择变化事件
     * @param value
     */
    handleOnChangeLogistics = (value) => {
        this.setState({logistics_id: value});
    };

    /**
     * 处理确认收货事件
     * @param id
     */
    handleConfirmReceive(id) {
        const _this = this;
        const data = {output_id: id};
        app.post(car.ADMIN_CONFIRMRECEIVE, data).then((result) => {
            if (result.code === 1) {
                app.alert('确认完成', 'success', 2);
                _this.handleGetList();
            } else {
                app.alert('确认失败', 'error', 2);
            }
        })
    };

    /**
     * 处理重发消息事件
     * @param id
     */
    handleSendMsgAgain(id) {
        const _this = this;
        const data = {output_id: id};
        app.post(car.SEND_MESSAGE, data).then((result) => {
            if (result.code === 1) {
                app.alert('发送成功', 'success', 2);
            } else {
                app.alert(result.msg, 'error', 2);
            }
        })
    }
};
const EditCar1s = Form.create()(EditCar1);

class ExpressInfo extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            editConfirmLoading: false,
            data: []
        }
    };

    render() {
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>物流信息</span>
                <Modal
                    maskClosable={true}
                    visible={this.state.editVisible}
                    confirmLoading={this.state.editConfirmLoading}
                    wrapClassName="vertical-center-modal"
                    title="物流信息"
                    width="700px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button type="primary" key="confirm" onClick={() => this.setModalVisible(false)}>确定</Button>
                    ]}
                >
                    <div className="clearfix" style={{height: '400px', overflow: 'auto'}}>
                        {
                            this.state.data.map((item, index) => {
                                return (
                                    <div key={index} style={{marginTop: '10px'}}>
                                        <div span={6}>{item.time}：</div>
                                        <div offset={1} span={17}>{item.context}</div>
                                    </div>
                                )
                            })
                        }
                    </div>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            this.handleGetList();
        }
        this.setState({editVisible: visible});
    };

    handleGetList() {
        let id = this.props.car_id;
        app.post(car.SEARCH_OUTPUTEXPRESS, {car_id: id}).then((result) => {
            if (result.code === 1) {
                let data = result.data.dataSet;
                console.log(data);
                this.setState({data});
            } else {
                this.setState({data: []});
                app.alert(result.msg, 'error', 3);
            }
        })
    }
};
const ExpressInfos = Form.create()(ExpressInfo);

class EditCustomerPosition extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            logisticsList: []
        }
    }

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>修改停靠位置</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='修改'
                    width="500px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="停靠位置" {...this.formItemLayout}>
                                            {
                                                getFieldDecorator('customer_position', {
                                                    rules: [{required: true, message: '请输入停靠位置'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = this.props.data;
            let formData = {
                customer_position: data.customer_position
            };
            this.props.form.setFieldsValue(formData);
        }
        this.setState({
            editVisible: visible
        })
    };

    clickOk() {
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let customer_id = this.props.data.customer_id;
                values.customer_id = customer_id;
                console.log(values);
                app.post(customer.EDIT_CUSTOMER, values).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleRefresh();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    }
}

const EditCustomerPositions = Form.create()(EditCustomerPosition);

class ExpressEdit extends Component {
    constructor(props) {
        super(props);
        this.state = {
            editVisible: false,
            addConfirmLoading: false,
            logisticsList: [],
            orderList: [],
            helpStr: '',
            statusStr: '',
            chooseData: {}
        }
    };

    formItemLayout = {
        labelCol: {span: 12},
        wrapperCol: {span: 8}
    };

    render() {
        const {getFieldDecorator} = this.props.form;
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer', marginLeft: '10px'}}
                      onClick={() => this.setModalVisible(true)}>修改</span>
                <Modal
                    maskClosable={true}
                    wrapClassName="vertical-center-modal"
                    visible={this.state.editVisible}
                    confirmLoading={this.state.addConfirmLoading}
                    title='填写快递'
                    width="600px"
                    onCancel={() => this.setModalVisible(false)}
                    footer={[
                        <Button key="back" type='default' onClick={() => this.setModalVisible(false)}>取消</Button>,
                        <Button key="submit" type='primary' onClick={() => this.clickOk()}>确定</Button>,
                    ]}
                >
                    <Row>
                                <Col offset={1} span={22}>
                                    <Form className="login-form">
                                        <FormItem label="快递公司" {...this.formItemLayout}
                                                  help={this.state.helpStr}
                                                  required={true}
                                                  validateStatus={this.state.statusStr}
                                        >
                                            {this.state.chooseData.express_name}
                                            <ChooseLogistics choose={(data) => this.handleChoose(data)}/>
                                        </FormItem>
                                        <FormItem label={"快递单号"} {...this.formItemLayout}>
                                            {
                                                getFieldDecorator("car_express_num", {
                                                    rules: [{required: true, message: '请输入快递单号'}]
                                                })(
                                                    <Input placeholder="请输入"/>
                                                )
                                            }
                                        </FormItem>
                                    </Form>
                                </Col>
                            </Row>
                </Modal>
            </span>
        )
    };

    setModalVisible(visible) {
        if (visible) {
            let data = this.props.data;
            let chooseData = {};
            chooseData.express_id = data.logistics_id;
            chooseData.express_name = data.car_logistics_name;
            let formData = {
                'car_express_num': data.car_express_num
            };
            this.props.form.setFieldsValue(formData);
            this.setState({chooseData});
        }
        this.setState({
            editVisible: visible
        })
    };

    componentDidMount() {
        this.handleSearchLogistics();
    }

    handleSearchLogistics(data = {page: 1, size: 100}) {
        app.post(logistics.SEARCH_LOGISTICSLIST, data).then((result) => {
            if (result.code === 1) {
                this.setState({logisticsList: result.data.dataSet});
            } else {
                this.setState({data: [], loading: false});
            }
        })
    };

    clickOk() {
        let chooseData = this.state.chooseData;
        let express_id = chooseData.express_id;
        if (express_id == undefined || express_id == null || express_id.length <= 0) {
            this.setState({
                helpStr: '请选择快递公司',
                statusStr: 'error',
            });
            return;
        } else {
            this.setState({
                helpStr: '',
                statusStr: '',
            });
        }
        this.props.form.validateFields((error, values) => {
            if (!error) {
                let data = {
                    car_id: this.props.data.car_id,
                    logistics_id: this.state.chooseData.express_id,
                    car_logistics_name: this.state.chooseData.express_name,
                    car_express_num: values.car_express_num
                };
                app.post(car.UPDATE_EXPRESS, data).then((result) => {
                    if (result.code === 1) {
                        app.alert(result.msg, 'success', 3);
                        this.setModalVisible(false);
                        this.props.handleReset();
                    } else {
                        app.alert(result.msg, 'error', 3);
                    }
                })
            }
        })
    };

    handleChoose(data) {
        let chooseData = data;
        this.setState({chooseData});
        this.setState({
            helpStr: '',
            statusStr: '',
        });
    }
}

const ExpressEdits = Form.create()(ExpressEdit);

//选择打印机
class ChoosePrinter extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            editVisible: false,
            editConfirmLoading: false,
            roleData: [],
            chooseData: [],
            confirmLoading: false,
            currentPrinterId:''
        }
    };

    formItemLayout = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };

    render() {
        return (
            <span>
                <span style={{color: '#1890ff', cursor: 'pointer'}} onClick={()=>this.setModalVisible(true)}>打印</span>
                <span>
                    <Modal
                        maskClosable={true}
                        visible={this.state.editVisible}
                        editConfirmLoading={this.state.editConfirmLoading}
                        confirmLoading={this.state.confirmLoading}
                        title="选择打印机"
                        wrapClassName="vertical-center-modal"
                        width="600px"
                        onCancel={() => this.setModalVisible(false)}
                        footer={[
                            <Button key="back" type='default' onClick={() => {
                                this.setModalVisible(false)
                            }}>取消</Button>,
                            <Button key="submit" type="primary" onClick={() => {
                                this.clickOk()
                            }}>确定</Button>
                        ]}
                    >
                    <div className="clearfix">
                        {
                            this.state.roleData.map((item, index) => {
                                return (
                                    <span key={index} className={item.printer_id == this.state.currentPrinterId ? "roleItem1" : "roleItem"}
                                          onClick={() => this.chooseRole(index)}>
                                        {item.printer_name}
                                    </span>
                                )
                            })
                        }
                    </div>
                </Modal>
                </span>
            </span>
        )
    };

    componentDidMount() {

    }

    /**
     * 获取打印机列表
     */
    handleGetPrinterData() {
        app.post(printer.SEARCH_PRINTERLIST, {page: 1, size: 1000}).then((result) => {
            if (result.code === 1) {
                let roleData = result.data.dataSet;
                this.setState({roleData: roleData});
            } else {
                app.alert(result.msg, 'error', 3);
                this.setState({roleData: []});
            }
        });
    }

    /**
     * 显示和隐藏弹框
     * @param visible
     */
    setModalVisible(visible) {
        if (visible) {
            let currentPrinterId='';
            let type=this.props.type;
            if(type==1){
                currentPrinterId=app.getData('printerIndependent');
            }else if(type==2){
                currentPrinterId=app.getData('printerMarket');
            }else if(type==3){
                currentPrinterId=app.getData('printerConsignment');
            }
            if(!currentPrinterId){
                currentPrinterId='';
            }
            this.setState({currentPrinterId:currentPrinterId});
            this.handleGetPrinterData();
        }
        this.setState({
            editVisible: visible
        });
    };

    /**
     * 选择打印机
     * @param index
     */
    chooseRole(index) {
        let data = this.state.roleData;
        let currentPrinterId = data[index].printer_id;
        this.setState({currentPrinterId: currentPrinterId});
    }

    /**
     * 处理确认事件
     */
    clickOk() {
        let currentPrinterId=this.state.currentPrinterId;
        if(!currentPrinterId){
            app.alert('请选择打印机','error',2);
            return;
        }
        let data = this.state.roleData;
        for(let i=0;i<data.length;i++){
            if(data[i].printer_id==currentPrinterId){
                let type=this.props.type;
                if(type==1){
                    app.setData('printerIndependent',currentPrinterId);
                }else if(type==2){
                    app.setData('printerMarket',currentPrinterId);
                }else if(type==3){
                    app.setData('printerConsignment',currentPrinterId);
                }
                this.setModalVisible(false);
                this.props.handlePrintCar(data[i].printer_ip);
            }
        }
    }
};
const ChoosePrinters = Form.create()(ChoosePrinter);


export {
    EditAddresss,//修改地址信息
    EditLines,//修改路线
    EditRoles,//选择员工
    EditOrders,//修改订单
    EditCars,//修改出车表
    EditAdmins,//修改管理员
    EditRoleManage,
    EditLogistics,//修改物流公司
    ConfirmChecks,//托运
    SendExpresss,//填写快递单
    EditCarPositions,//修改停靠位置和客户车牌号
    EditCustomerPositions,//修改停靠位置
    EditCar1s,//修改出车表
    ExpressInfos,//物流信息
    EditMarketCars,//送市场详情组件
    ExpressEdits,//修改快递信息
    EditPrinters,//修改打印机
    ChoosePrinters,//选择打印机
}